<template>
  <view class="tab-component">
    <view class="text-segmentation">精选推荐</view>
  </view>
</template>

<script>
import { defineComponent, reactive, toRefs } from "vue";
export default defineComponent({
  name: "",
  props: {},
  components: {},
  setup() {
    const data = reactive({});
    return {
      ...toRefs(data),
    };
  },
});
</script>

<style scoped lang="less">
.tab-component {
  display: flex;
  flex-direction: column;
  align-items: center;
  .text-segmentation {
    position: relative;
    font-weight: 300;
    &::after,
    &::before {
      content: "";
      text-align: center;
      border-radius: 3rpx;
      position: absolute;
      width: 26rpx;
      height: 4rpx;
      right: -36rpx;
      top: 50%;
      transform: translateY(-50%);
      color: #fff;
      background: #7b7b7b;
    }
    &::after {
      left: -36rpx;
    }
  }
}
</style>
